<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="js/axios.min.js"></script>
    <script>

        //  路径参数：将参数以地址方式隐藏在请求地址中，作为服务器解析使用的一种特殊参数
        //  后端接口开发规范RestfulApi接口规范=>减少接口地址的数量
        //  通过http请求类型区分相同地址的不同功能
        //  http://127.0.0.1:3000/users描述和用户相关的操作(查询、删除、修改、添加)
          /*   
            get ===> 服务器会设置为查询方法
                        查询单个用户
                        查询所有用户

            delete===>服务器设置为删除方法
                        删除单个用户

            post===>服务器设置为添加方法
                        传递几个参数过去添加用户

            ....
        */

        //  标题(用户查询)
        //  /user/:id   => id为路径参数
        //  /user/{id}  => id为路径参数

        // koa服务器：router.get("/stu/:id") ctx.params来获取路径参数
        function findStuById(){
            axios.get("http://127.0.0.1:3000/test/stu/10002")
            .then(function(res){
                console.log(res.data);
            }).catch(function(error){
                console.log(error);
            });
        }
        function findStus(){
            axios.get("http://127.0.0.1:3000/test/stu")
            .then(function(res){
                console.log(res.data);
            }).catch(function(error){
                console.log(error);
            });
        }

        function deleteOneStu(){
            axios.delete("http://127.0.0.1:3000/test/stu/10002")
            .then(function(res){
                console.log(res.data);
            }).catch(function(error){
                console.log(error);
            });
        }

        function addOneStu(){
            axios.post("http://127.0.0.1:3000/test/stu/10004/aqing/男")
            .then(function(res){
                console.log(res.data);
            }).catch(function(error){
                console.log(error);
            });
        }
    </script>
</head>
<body>
    <input type="button" value="查询某一个用户" onclick="findStuById()">
    <input type="button" value="查询某一个用户" onclick="findStus()">
    <input type="button" value="删除某一个用户" onclick="deleteOneStu()">
    <input type="button" value="添加某一个用户" onclick="addOneStu()">
</body>
</html>